status/system: "Move" spacer in desktop case

When we aren't showing the power toggle (read: on systems without
a battery), all items in the top are located on one side. Address
this by "moving" the spacer between "Settings" and "Screen Lock"
in that case to balance items a bit better.

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2439>

diff --git a/js/ui/status/system.js b/js/ui/status/system.js
index 204a78ac342b4738b4d9a2be9d9d05ed2974bf22..a45697adb48d04781390b6b7fd9c8af8c4cf0243 100644 (file)
--- a/js/ui/status/system.js
+++ b/js/ui/status/system.js
@@ -236,12 +236,22 @@ class SystemItem extends QuickSettingsItem {
         this._powerToggle = new PowerToggle();
         this.child.add_child(this._powerToggle);
 
-        // spacer
-        this.child.add_child(new Clutter.Actor({x_expand: true}));
+        this._laptopSpacer = new Clutter.Actor({x_expand: true});
+        this._powerToggle.bind_property('visible',
+            this._laptopSpacer, 'visible',
+            GObject.BindingFlags.SYNC_CREATE);
+        this.child.add_child(this._laptopSpacer);
 
         const settingsItem = new SettingsItem();
         this.child.add_child(settingsItem);
 
+        this._desktopSpacer = new Clutter.Actor({x_expand: true});
+        this._powerToggle.bind_property('visible',
+            this._desktopSpacer, 'visible',
+            GObject.BindingFlags.INVERT_BOOLEAN |
+            GObject.BindingFlags.SYNC_CREATE);
+        this.child.add_child(this._desktopSpacer);
+
         const lockItem = new LockItem();
         this.child.add_child(lockItem);